/* 
    Document   : style
    Created on : Sep 3, 2013, 11:39:30 PM
    Author     : Thai Ha Cong
    Description:
        Purpose of the stylesheet follows.
*/

root { 
    display: block;
}

/*---------------------------------*/
.headerbg{
    float: left;
    margin: 0;
    padding: 0;
    width: 100%;
    height: 90px;
    background-color: lightgoldenrodyellow;
}

.header{
    margin: auto;
    padding: 0;
    width: 1024px;
    height: 90px;
    background-color: aliceblue;
}

.headerLeft{
    float: left;
    margin: 0;
    padding: 0;
    width: 512px;
    height: 90px;
    background-color: lavenderblush;
}

.headerRight{
    float: left;
    margin: 0;
    padding: 0;
    width: 512px;
    height: 90px;
    background-color: lavender;
}

#firstLine{
    float: left;
    margin: 0;
    padding: 0;
    width: 512px;
    height: 30px;
    background-color: antiquewhite;
}

#firstLineLeft{
    float: left;
    margin: 0;
    padding: 0;
    width: 256px;
    height: 30px;
    background-color: graytext;
}

.cartIcon{
    float: right;
    margin: 8px;
    padding: 0 5px 0 25px;
    background-image: url("shoppingCart.png");
    background-repeat: no-repeat;
    background-position: left center;
}

.topLine{
    font-family: helvetica, arial, sans-serif;
    font-size: 12px;
    color: #FFFFFF;
}

#firstLineRight{
    float: left;
    margin: 0;
    padding: 0;
    width: 256px;
    height: 30px;
    background-color: #33425A;
}

#flr1{
    float: left;
    margin: 0;
    padding: 4px 10px;
    width: 160px;
    height: 22px;
    /*background-color: greenyellow;*/
    text-align: right;
    color: #FFFFFF;
}

#flr2{
    float: left;
    margin: 0;
    padding: 4px;
    width: 68px;
    height: 22px;
    /*background-color: #33425A;*/
    text-align: center;
    color: #FFFFFF;
}

#secondLine{
    float: left;
    margin: 0;
    padding: 0;
    width: 512px;
    height: 30px;
    background-color: lavender;
}

#thirdLine{
    float: left;
    margin: 0;
    padding: 0;
    width: 512px;
    height: 30px;
    background-color: ivory;
}

/*---------------------------------*/
.contentbg{
    float: left;
    margin: 0;
    padding: 0;
    width: 100%;
    height: auto;
    background-color: lightgrey;
}

.content{
    float: none;
    margin: auto;
    padding: 0;
    width: 1024px;
    height: auto;
    background-color: lightgoldenrodyellow;
}

/*-----------------*/
.contentLeft{
    float: left;
    margin: 0;
    padding: 0;
    width: 160px;
    height: 904px;
    background-color: lightblue;
}

.contentRight{
    float: left;
    margin: 0;
    padding: 0;
    width: 864px;
    height: 904px;
    background-color: lightsteelblue;
}

/*-----------------*/
.body{
    float: left;
    margin: 0;
    padding: 0;
    width: 864px;
    height: 904px;
    background-color: khaki;
}

.bodyUpper{
    float: left;
    margin: 0;
    padding: 16px;
    width: 832px;
    height: 836px;
    background-color: lightcyan;
}

.productSummary{
    float: left;
    margin: 0;
    padding: 4px;
    width: 200px;
    height: auto;
    background-color: cyan;
}

.productSmallImage{
    float: left;
    margin: 0;
    padding: 0;
    width: 200px;
    height: 200px;
    background-color: greenyellow;
}

.productSummmaryInfo{
    float: left;
    margin: 0;
    padding: 4px 0;
    width: 200px;
    height: 64px;
    background-color: yellow;
}

.pageNavigation{
    float: left;
    margin: 0;
    padding: 0 16px;
    width: 832px;
    height: 36px;
    background-color: lime;
}

/*-----------------*/
.productDetail{
    float: left;
    margin: 0;
    padding: 16px;
    width: 832px;
    height: 872px;
    background-color: aqua;
}

.productImage{
    float: left;
    margin: 0;
    padding: 0;
    width: 480px;
    height: 480px;
    background-color: gray;
}

.productInfo{
    float: left;
    margin: 0;
    padding: 16px;
    width: 320px;
    height: 448px;
    background-color: gainsboro;
}

.productDescription{
    float: left;
    margin: 0;
    padding: 16px;
    width: 800px;
    height: 360px;
    background-color: snow;
}

/*-----------------*/
.shoppingCart{
    float: none;
    margin: auto;
    padding: 32px;
    width: 960px;
    height: auto;
    /*min-height: 256px;*/
    font-family: calibri;
    background-color: mintcream;
}

.itemsOnCart{
    float: none;
    margin: auto;
    padding: 0;
    width: 960px;
    height: auto;
    font-family: calibri;
    background-color: black;
}

.itemsOnCart table{
    table-layout: fixed;
    border: 0;
    border-spacing: 0;
    border-collapse: collapse;
    margin: 0;
    padding: 0;
    width: auto;
    background-color: #D5D5D5;
}

.itemsOnCart th, .itemsOnCart td{
    border-right: 1px solid #FFFFFF;
    border-bottom: 1px solid #FFFFFF;
    padding: 8px 5px 5px 5px;
}

.cQty{
    width: 80px;
    margin: auto;
    text-align: center;
}

.cRem{
    width: 80px;
    margin: auto;
    text-align: center;
}

.cDes{
    width: 505px;
    text-align: left;
}

.productTinyImage{
    float: left;
    margin: 0;
    padding: 0;
    width: 64px;
    height: 64px;
    /*background-color: blanchedalmond;*/
}

.productInfoCart{
    float: left;
    margin: 0;
    padding: 5px 10px;
    width: 421px;
    height: 54px;
    /*vertical-align: middle;*/
    line-height: 54px;
    /*background-color: wheat;*/
}

.cPri{
    width: 120px;
    text-align: right;
}

.cTot{
    width: 120px;
    text-align: right;
}

.buttonOnShoppingCart{
    /*float: left;*/
    margin: 16px 0px;
    padding: 0;
    width: 960px;
    height: 36px;
    background-color: lime;
}

.buttonContinue{
    float: left;
    margin: 0;
    padding: 0;
    width: 160px;
    height: 36px;
    line-height: 36px;
    background-color: ivory;
    text-align: center;
}

.buttonProcess{
    float: right;
    margin: 0;
    padding: 0;
    width: 160px;
    height: 36px;
    line-height: 36px;
    background-color: ivory;
    text-align: center;
}

/*---------------------------------*/
.advancedSearch{
    float: none;
    margin: auto;
    padding: 32px 224px;
    width: 576px;
    height: auto;
    font-family: calibri;
    background-color: lightsteelblue;
}

.advancedSearch th, .advancedSearch td{
    padding: 3px;
}

/*---------------------------------*/
.processOrder{
    float: none;
    margin: auto;
    padding: 32px 187px;
    width: 650px;
    height: auto;
    font-family: calibri;
    background-color: lightsteelblue;
}

.processOrder th, .processOrder td{
    padding: 3px;
}

/*---------------------------------*/
.footerbg{
    float: left;
    margin: 0;
    padding: 0;
    width: 100%;
    height: auto;
    background-color: red;
}

.footer{
    float: none;
    margin: auto;
    padding: 10px 20px;
    width: 984px;
    height: auto;
    background-color: lightslategray;
}

.footer p{
    font-family: calibri;
    margin: 0;
    padding: 0;
}